<template>
	<!-- 活动风采 -->
	<view class="card-active" hover-class="hover-class" @click="gettoWriter_detail(options.id)">
		<image class="card-active_cover" :src="imgURL+options.indexImg"></image>
		<view class="card-active_content">
			<view class="text-df text-bold l-line1">{{ options.artName }}</view>
			<view class="card-active_content_info">
				<view class="l-f l-mg-top8">
					<image class="card-active_content_info_icon" :src="imgURL3+'activity/time.png'"
						mode="aspectFill"></image>
					<view class="card-active_content_info_time">{{ options.createTime }}</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script lang="ts" setup>
	import { imgURL, imgURL3 } from '@/api/request';
	defineProps({
		options: {
			required: true,
			type: Object,
			default() {
				return {}
			}
		}
	})
	
	const gettoWriter_detail = (id: string) =>{
		uni.navigateTo({
			url: `/pages/message/detail?id=${id}`
		})
	}
</script>

<style scoped lang="scss">
.card-active {
	height: 300rpx;
	background-color: #fff;
	border-radius: 20rpx;
	box-shadow: 0 6rpx 16rpx 0 rgba(0, 0, 0, 0.16);
	overflow: hidden;
	&_cover {
		height: 180rpx;
		width: 100%;
	}
	&_content {
		padding: 10rpx 20rpx;
		box-sizing: border-box;
		&_info {
			display: flex;
			justify-content: space-between;
			margin-top: 10rpx;
			&_icon {
				width: 24rpx;
				height: 24rpx;
			}
			&_time {
				font-size: 24rpx;
				color: #8E8E8E;
				margin-left: 6rpx;
			}
		}
	}
}
</style>